
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>多分支步骤节点插件</title>
</head>
<body>
<canvas id="area" width="1300" height="400">
    请升级浏览器
</canvas>
<script type="text/javascript" src="./smartNode.js"></script>
<script>
    (function(){
        var canvas = document.getElementById('area');
        canvas.style.border = "1px solid silver";
        var context = canvas.getContext("2d");
        var smartNode = new SmartNode({
            data:[
                {
                title:'开嘱',
                color:'orange',
                note:'05:06 08:35'
            },
            {
                title:'复核',
                color:'orange',
                content:'方明/2346',
                note:'05:06 08:35'
            },
                {
                    title:'熊大',
                    color:'red',
                    content:'方明/2346',
                    note:'05:06 08:35'
                },
            {
                title:'审核',
                color:'orange',
                content:'方明/2346',
                note:'05:06 08:35'
            },
                [
                {
                    title:'发药',
                    color:'orange',
                    name:'维生素C注射液',
                    note:'05:06 08:31',
                    noteColor:'green'
                },{
                    title:'发药',
                    color:'orange',
                    name:'维生素C',
                    note:'05:06 08:32',
                    noteColor:'#36abd8'
                },
                    {
                    title:'发药',
                    color:'orange',
                    name:'维生素C注',
                    note:'05:06 08:33',
                    noteColor:'red'
                }
            ],
                [
                {
                    title:'配送',
                    color:'orange',
                    name:'维生素C注射液',
                    note:'05:06 08:31',
                    noteColor:'green'
                },{
                    title:'配送',
                    color:'orange',
                    name:'维生素',
                    note:'05:06 08:32',
                    noteColor:'#36abd8'
                },{
                    title:'配送',
                    color:'orange',
                    name:'维生素C',
                    note:'05:06 08:33',
                    noteColor:'red'
                }
            ],[
                {
                    title:'签收',
                    color:'orange',
                    name:'维生素C注射液',
                    note:'05:06 08:31',
                    noteColor:'green'
                },{
                    title:'签收',
                    color:'orange',
                    name:'维生素',
                    note:'05:06 08:32',
                    noteColor:'#36abd8'
                },{
                    title:'签收',
                    color:'orange',
                    name:'维生素C',
                    note:'05:06 08:33',
                    noteColor:'red'
                }
            ],{
                title:'执行',
                color:'orange',
                name:'维生素C注射液',
                note:'05:06 08:35',
                noteColor:'red'
            },{
                title:'停嘱',
                color:'silver',
                name:'维生素C注射液',
                note:'05:06 08:35',
                noteColor:'red'
            }]
        });
        smartNode.render(canvas);
        smartNode.onClick(function(node){
            alert("node{"+node.x+","+node.y+"} 被点击");
        })
    })();
</script>
</body>
</html>